<template>
  <div class="col main-content">
    <div class="row tool-bar">
      <div class="col">
        <el-button type="primary" @click="add"><i class="fa fa-th-large"></i> 添加等级</el-button>
      </div>
    </div>
    <div class="row">
      <div class="col">
        <el-table
          ref="table"
          :data="grades"
          border
          stripe
          tooltip-effect="dark"
          style="width: 100%">
          <el-table-column
            type="index"
            width="48" align="center">
          </el-table-column>
          <el-table-column label="等级名称" prop="code"></el-table-column>
          <el-table-column label="起始消费" prop="points"></el-table-column>
          <el-table-column label="优惠比例">
            <template slot-scope="scope">
              <span class="red">{{scope.row.discounts}}%</span>
            </template>
          </el-table-column>
          <el-table-column label="运费优惠">
            <template slot-scope="scope">
              <el-checkbox v-model="scope.row.freight==1"></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column label="说明">
            <template slot-scope="scope">
              {{scope.row.note}}
            </template>
          </el-table-column>
          <el-table-column label="操作" width="60" align="center">
            <template slot-scope="scope">
              <el-button type="text" @click="edit(scope.$index,scope.row)">编辑</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
    <h-admin-grade-edit :title="title" :show.sync="showEdit" v-model="currentData"
                        @success="doneEdit"></h-admin-grade-edit>

  </div>
</template>
<script>
  import AdminService from 'src/service/admin'
  import HAdminGradeEdit from 'src/components/admin/system/components/GradeEdit'

  export default {
    name: 'AdminGrade',
    components: {
      HAdminGradeEdit
    },
    data() {
      return {
        title: '创建',
        grades: [],
        showEdit: false,
        currentData: {}
      }
    },
    methods: {
      getDatas: function () {
        const me = this
        AdminService.userGrade().then(function (data) {
          if (data.code == 0 && data.datas != null) {
            me.grades = data.datas
          }
        })
      },
      doneEdit: function (data) {
        this.showEdit = false
        this.getDatas()
      },
      edit: function (index, data) {
        this.title = '编辑'
        this.currentData = data
        this.showEdit = true
      },
      add: function () {
        this.title = '创建'
        this.currentData = {
          id: null,
          code: '',
          points: 0,
          discounts: 0,
          note: ''
        }
        this.showEdit = true
      }
    },
    beforeMount: function () {
      this.getDatas()
    }
  }
</script>
